.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;
		min-height: 90vh;
	}

	.heard {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100vw;
		height: auto;
		background: rgba(255, 255, 255, 1);
		padding-bottom: 28rpx;
		padding-top: 10rpx;
	}


	.seach-box {
		display: flex;
		width: 674.65rpx;
		margin-top: 18rpx;
	}

	.type-item {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 192.76rpx;
		height: 66.59rpx;
		opacity: 1;
		border-radius: 10.51rpx;
		background: rgba(255, 255, 255, 1);
		border: 1.75rpx solid rgba(252, 247, 247, 1);
		margin-right: 16rpx;

		text {
			font-size: 21.03rpx;
			font-weight: 400;
			letter-spacing: 0px;
			line-height: 30.46rpx;
			color: rgba(102, 102, 102, 1);
			margin-right: 28rpx;

		}

		.type-item-icon {
			font-size: 24rpx;
			color: rgba(102, 102, 102, 1);
		}


	}

	.value-item {
		width: 345.21rpx;
		height: 66.59rpx;
		opacity: 1;
		border-radius: 10.51rpx;
		background: rgba(255, 255, 255, 1);
		margin-left: 9rpx;
		border: 1.75rpx solid rgba(252, 247, 247, 1);

		.uni-input {
			height: 66.59rpx;
			width: 345.21rpx;
			padding: 0 23rpx;
		}
	}

	.seach-btn {
		display: flex;
		align-items: center; 
		justify-content: center;
		width: 101.64rpx;
		height: 66.59rpx;
		opacity: 1;
		border-radius: 10.51rpx;
		background: rgba(166, 166, 166, 1);
		border: 1.75rpx solid rgba(252, 247, 247, 1);
		margin-left: 19rpx;

		text {
			font-size: 21.03rpx;
			line-height: 30.46rpx;
			color: rgba(51, 51, 51, 1);
		}

	}


	.ranking-list {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;

	}

	.ranking-item {
		display: flex;
		flex-direction: column;
		
		position: relative; 
		padding: 24rpx;
		width: 670rpx;
		min-height: 168rpx;
		border-radius: 18rpx;
		background: rgba(255, 255, 255, 1);
		border: 2rpx solid rgba(236, 236, 236, 1);
		margin-bottom: 32rpx; 
	} 

	.ranking-item-top {
		display: flex;
		align-items: center;
		width: 100%;

		.type-color-title1 {
			margin-left: 12rpx;
			font-size: 32rpx;
			line-height: 35.52rpx;
			color: rgba(42, 130, 228, 1);
		}

		.type-color-title2 {
			font-size: 32rpx;
			line-height: 35.52rpx;
			color: rgba(166, 166, 166, 1);
		}
	}

	.ranking-item-bottom {
		display: flex;
		align-items: center;
		width: calc(100% - 112rpx);
		margin-top: 36rpx;

		.ranking-item-bottom-title {
			font-size: 32rpx;
			line-height: 30.46rpx;
			color: rgba(51, 51, 51, 1);
			margin-right: 12rpx;

		}

		.ranking-item-bottom-remask {
			flex: 1;
			max-height: 90rpx;
			font-size: 32rpx;
			line-height: 30rpx;
			color: rgba(102, 102, 102, 1);

			display: -webkit-box;
			-webkit-box-orient: vertical;
			-webkit-line-clamp: 3;
			/* 控制显示的行数 */
			overflow: hidden;
			text-overflow: ellipsis;
			/* 当文本溢出时显示省略号 */
		}
	}

	.fraction {
		display: flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		top: 32rpx;
		right: 21rpx;
		width: 120.39rpx;
		height: 120.39rpx;
		background: rgba(208, 226, 247, 1);
		border: 1.75rpx solid rgba(236, 236, 236, 1);
		border-radius: 50%;
	}

	.fraction-text {
		font-size: 63.08rpx;
		line-height: 91.35rpx; 
		color: rgba(212, 48, 48, 1);

	}

	.fraction-text-min { 
		color: rgba(255, 141, 26, 1);
		
	}
 
	.type-color {
		display: flex;
		justify-content: center;
		align-items: center; 
		padding: 8rpx 12rpx;

		border-radius: 5.26rpx;
		font-size: 28rpx;
		line-height: 20.29rpx;
		color: rgba(255, 255, 255, 1);
	}

	.type-color-1 {
		background: rgba(42, 130, 228, 1);
	}

	.type-color-2 {
		background: rgba(255, 141, 26, 1);
	}

	.type-color-3 {
		background: rgba(0, 186, 173, 1);
	}

	.type-color-4 {
		background: rgba(255, 87, 51, 1);
	}